// 编辑器配置
export const getEditorConfig = (srcList, valueHtml) => ({
  placeholder: '请输入活动详情内容...',
  MENU_CONF: {
    uploadImage: {
      server: 'https://hmajax.itheima.net/api/uploadimg', // 根据实际接口修改
      customInsert(res, insertFn) {                  // JS 语法
        // res 即服务端的返回结果
        // 从 res 中找到 url alt href ，然后插入图片
        console.log("res 即服务端的返回结果", res);

        const { url } = res.data;
        const alt = "";
        const href = "";
        console.log('编辑器上传了图片', url);
        if (!srcList.value.includes(url)) {
          srcList.value.push(url)
        }

        insertFn(url, alt, href);
      },
      fieldName: 'img',
      // 设置 base64LimitSize，如果文件小于该大小，则转为 Base64 格式
      base64LimitSize: 5 * 1024,// 5KB
      // 单个文件上传成功之后
      onSuccess(file, res) {          // JS 语法
        // console.log("文件类", file);
        // console.log(`${file.name} 该文件名上传成功,后面是响应`, res)
      },
      // 单个文件的最大体积限制，默认为 2M
      maxFileSize: 10 * 1024 * 1024, // 1M
      // 最多可上传几个文件，默认为 100
      maxNumberOfFiles: 100,
      // 选择文件时的类型限制，默认为 ['image/*'] 。如不想限制，则设置为 []
      allowedFileTypes: ['image/*'],
      //回调函数-------------------------
      // 单个文件上传失败
      onFailed(file, res) {           // JS 语法
        console.log(`${file.name} 上传失败`, res)
      },
      // 上传错误，或者触发 timeout 超时
      onError(file, err, res) {               // JS 语法
        console.log(`${file.name} 上传出错`, err, res)
      },


    },
    insertImage: {
      onInsertedImage(imageNode) {                    // JS 语法
        if (imageNode == null) return

        const { src, alt, url, href } = imageNode
        console.log('插入了图片', src, alt, url, href)
        //如果图片上传了,自然会加载到srcList中,
        // 但是base64图片不上传,所以需要手动追加到srcList中
        // 检查是否是Base64图片且数组中不存在
        if (isBase64Image(src) && !srcList.value.includes(src)) {
          srcList.value.push(src)
          console.log('已添加Base64图片到数组:', src)
        }
      },

    },
    editImage: {
      onUpdatedImage(imageNode) {
        console.log('编辑器更新了图片');                  
        if (imageNode == null) return

        // 加载图片列表（自动解码URL）
        const imgList = extractImgSrc(valueHtml.value);
        console.log('解码后的图片列表', imgList);
        srcList.value = imgList; // 更新 srcList

        const { src, alt, url } = imageNode
        console.log('updated image', src)
      },
    },
    onchange: (html) => {
      console.log('草泥马，onchange被触发了');
      const newImgList = extractImgSrc(html); // 提取当前编辑器中的图片地址
      const deletedImgs = srcList.filter(img => !newImgList.includes(img));
      console.log('删除了onChange图片', deletedImgs);
      deletedImgs.forEach(img => {
        // 调用后端删除接口
        srcList = srcList.filter(item => item !== img); // 同步删除 srcList 中的图片
      });
    },
    // 监听删除操作（需自定义或通过键盘事件）
    onDelete: () => {
      console.log('草泥马，onDelete被触发了');
      const currentImgs = extractImgSrc(editor.txt.html());
      console.log('当前编辑器中的图片', currentImgs);
      srcList = srcList.filter(img => currentImgs.includes(img)); // 同步更新
      console.log('删除后剩余的图片', srcList.value);
    },
    deleteImage: {
      // 删除图片时的回调
      onDeletedImage(imageNode) {
        console.log('草泥马,deleteImage被触发了');

        console.log(imageNode);
        if (imageNode?.src) {
          // 从srcList中移除对应的图片URL
          const index = srcList.value.findIndex(url => url === imageNode.src)
          if (index !== -1) {
            console.log('删除了图片', imageNode.src)
            srcList.value.splice(index, 1) // 删除指定元素
          }
        }
      }
    }

  }
})
// 辅助函数：判断是否是Base64图片
function isBase64Image(src) {
  return src && (
    src.startsWith('data:image/png;base64,') ||
    src.startsWith('data:image/jpeg;base64,') ||
    src.startsWith('data:image/gif;base64,') ||
    src.startsWith('data:image/webp;base64,')
  )
}

/**
 * 提取HTML中的图片地址
 * @param {string} html
 * @returns {string[]}
 */
export const extractImgSrc = (html) => {
  const reg = /<img.*?src="(.*?)"/g;
  // return [...html.matchAll(reg)].map(match => match[1]);

  const matches = [...html.matchAll(reg)];

  return matches.map(match => {
    // 解码HTML实体（如 &amp; -> &）
    const decodedUrl = match[1].replace(/&amp;/g, '&');
    return decodedUrl;
  });
};

// 工具栏配置
export const toolbarConfig = {
  excludeKeys: ['fullScreen']
}

